<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>仿小米首页</title>
	<link rel="stylesheet" href="./css/main.css">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	<script src="./js/main.js"></script>
</head>
<body>
	<!-- 广告开始 -->
	<div class="ad">
		<a href="">
		</a>
	</div>
	<!-- 顶部开始 -->
	<div class="top">
		<div class="top_mid">
			<div class="top_left">
				<a href="">小米商城</a>|
				<a href="">MIUI</a>|
				<a href="">IoT</a>|
				<a href="">云服务</a>|
				<a href="">金融</a>|
				<a href="">有品</a>|
				<a href="">小爱开放平台</a>|
				<a href="">政企服务</a>|
				<a href="">Select Region</a>
			</div>
			<div class="top_right">
				<a href="">登录</a>|
				<a href="">注册</a>|
				<a href="">消息通知</a>
				<a class="cart" href=""><i class="iconfont">&#xe63f;</i>购物车（0）
					<div class="cart_show">
						购物车中还没有商品，赶紧选购吧！
					</div>
				</a>
			</div>
		</div>
	</div>
	<!-- 头部开始 -->
	<div class="header">
		<div class="header_mid">
			<div class="nav">
				<div class="logo">
					<a class="mi" href=""></a>
					<a class="super" href=""></a>
				</div>
				<div class="menu">
					<a href="">小米手机
					</a>
					<a href="">红米</a>
					<a href="">电视</a>
					<a href="">笔记本</a>
					<a href="">空调</a>
					<a href="">新品</a>
					<a href="">路由器</a>
					<a href="">智能硬件</a>
					<a href="">服务</a>
					<a href="">社区</a>
				</div>
				<div class="search">
					<input class="in" type="text">
					<input class="btn iconfont" value="&#xe651;" type="submit">
					<p class="hot_search">
						<a href="">小米8</a>
						<a href="">小米MIX 2s</a>
					</p>
				</div>
			</div>
			<div class="banner" id="banner">
				<ul class="img_list">
					<li class="img_item"><img src="./images/banner.jpg" alt=""></li>
					<li class="img_item"><img src="./images/banner1.jpg" alt=""></li>
					<li class="img_item"><img src="./images/banner2.jpg" alt=""></li>
					<li class="img_item"><img src="./images/banner3.jpg" alt=""></li>
					<li class="img_item"><img src="./images/banner4.jpg" alt=""></li>
				</ul>
				<ul class="menu_list">
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a>
						<div class="item_son">
							1 BOX
						</div>
					</li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a>
						<div class="item_son">
							2  BOX
						</div>
					</li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a>
						<div class="item_son">
							3 BOX
						</div>
					</li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
					<li class="item"><a href="">手机 电话卡<i class="iconfont">&#xe65f;</i></a></li>
				</ul>
				<div class="click_left" id="click_left">
					<i class="iconfont">&#xe660;</i>
				</div>
				<div class="click_right" id="click_right">
					<i class="iconfont">&#xe65f;</i>
				</div>
				<ul class="click_list">
					<li class="click_item"></li>
					<li class="click_item"></li>
					<li class="click_item"></li>
					<li class="click_item"></li>
					<li class="click_item"></li>
				</ul>
			</div>
			<div class="server">
				<ul class="tool_list">
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
						<div class="right_line"></div>
						<div class="bottom_line"></div>
					</li>
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
						<div class="right_line"></div>
						<div class="bottom_line"></div>
					</li>
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
						<div class="bottom_line"></div>
						
					</li>
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
						<div class="right_line"></div>
					</li>
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
						<div class="right_line"></div>
					</li>
					<li class="tool_item">
						<a href="">
							<i class="iconfont">&#xe663;</i>
							选购手机
						</a>
					</li>
				</ul>
				<a href="" class="hot_pro"><img src="./images/hot_pro.jpg" alt=""></a>
				<a href="" class="hot_pro"><img src="./images/hot_pro.jpg" alt=""></a>
				<a href="" class="hot_pro last"><img src="./images/hot_pro.jpg" alt=""></a>
			</div>
			<div class="gou"></div>
			<div class="header_ad"></div>
		</div>
	</div>

	<div class="menu_bg">
		<ul class="menu_mid">
			<li>li1</li>
			<li>li2</li>
			<li>li3</li>
			<li>li4</li>
			<li>li5</li>
		</ul>
	</div>
	<!-- 主体开始 -->
	<div class="main"></div>
	<!-- 底部开始 -->
	<div class="footer"></div>
</body>
</html>